<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>vue控制流指令</title>
    <script src="./lib/vue2.6.11.js" ></script>
</head>

<body>
<div id="app">
    <table border="1">
        <thead>
        <th>学科</th>
        <th>分数</th>
        </thead>
        <tbody>
        <tr>
            <td>数学</td>
            <td><input type="text" v-model.number="math"></td>
        </tr>
        <tr>
            <td>物理</td>
            <td><input type="text" v-model.number="physics"></td>
        </tr>
        <tr>
            <td>英语</td>
            <td><input type="text" v-model.number="english"></td>
        </tr>
        <tr>
            <td>总分</td>
            <td>{{ sum }}</td>
        </tr>
        <tr>
            <td>平均分</td>
            <td>{{ average }}</td>
        </tr>
        </tbody>
    </table>
</div>

</body>
</html>

<script src="./js/main.js" ></script>
<!--
v-if和v-show的区别
v-if隐藏, 是dom中永久删除
v-show隐藏, dom中还存在,只是单纯隐藏
 -->
